function init(json) {
    initMonsterTable(json);

    $(".main-nav a[data-toggle='tab']").on("show.bs.tab", function (e) {
        console.log("test", e);
    });

    $(".main-nav a[data-toggle='tab']").on("shown.bs.tab", function (e) {
        console.log("test", e);
    });
}

function initMonsterTable(data) {
    if ($.fn.DataTable.isDataTable("#monster-table")) {
        $("#monster-table").DataTable().MakeCellEditable("destroy");
        $("#monster-table").DataTable().destroy();
    }

    $("#monster-table").html($('#monster-table-header').html());

    var monsterColumns = [
        {
            data: "id",
            orderable: true,
            searchable: true,
            className: "text-center"
        },
        {
            data: "妖怪",
            orderable: true,
            searchable: true,
            className: "text-center"
        },
        {
            data: "品质",
            orderable: false,
            className: "text-center"
        },
        {
            data: "元素",
            orderable: false,
            className: "text-center"
        },
        {
            data: "星",
            orderable: false,
            className: "text-center"
        },
        {
            data: "特性",
            orderable: false,
            className: "text-center"
        },
        {
            data: "力",
            orderable: true,
            className: "text-center"
        },
        {
            data: "智",
            orderable: true,
            className: "text-center"
        },
        {
            data: "魅",
            orderable: true,
            className: "text-center"
        },
        {
            data: "速",
            orderable: true,
            className: "text-center"
        },
        {
            data: "运",
            orderable: true,
            className: "text-center"
        },
        {
            data: "技",
            orderable: true,
            className: "text-center"
        },
        {
            data: "技能",
            orderable: false,
            className: "text-center"
        },
        {
            data: "进化",
            orderable: false,
            className: "text-center"
        }
    ];

    var monsterData = [];
    for (var s of data.monsters) {
        var ss = s.split('|');
        console.assert(ss.length == 14);
        monsterData.push({
            id: Number(ss[0]),
            "妖怪": ss[1],
            "品质": ss[2],
            "元素": ss[3],
            "星": Number(ss[4]),
            "特性": ss[5].replace(/\,/g, " "),
            "力": Number(ss[6]),
            "智": Number(ss[7]),
            "魅": Number(ss[8]),
            "速": Number(ss[9]),
            "运": Number(ss[10]),
            "技": Number(ss[11]),
            "技能": ss[12].replace(/\,/g, "<br>"),
            "进化": ss[13]
        });
    }

    var monsterTable = $("#monster-table").DataTable({
        data: monsterData,
        columns: monsterColumns,
        pagingType: "numbers"
    });
}